<template>
    <div>
        <!-- <mt-header fixed title="首页"></mt-header> -->
        <!-- 轮播图 -->
        <Lunbo />
        <!--六宫格-->
        <div class="mui-content">
		        <ul class="mui-table-view mui-grid-view mui-grid-9">
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><router-link to="/home/newlist">
		                    <!-- <span class="mui-icon mui-icon-home"></span> -->
		                    <span class="pic">
                                <img src="../../images/55st.png" alt="" width="70%">
                            </span>

		                    <div class="mui-media-body">新闻资讯</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><router-link to="/home/photoshare">
		                    <!-- <span class="mui-icon mui-icon-email"><span class="mui-badge">5</span></span> -->
                               <span class="pic">
                                <img src="../../images/106st.png" alt="" width="70%">
                            </span>
		                    <div class="mui-media-body">图片分享</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><router-link to="/home/shoplist">
		                    <!-- <span class="mui-icon mui-icon-chatbubble"></span> -->
                             <span class="pic">
                                <img src="../../images/56st.png" alt="" width="70%">
                            </span>
		                    <div class="mui-media-body">商品购买</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><router-link to="/">
		                    <!-- <span class="mui-icon mui-icon-location"></span> -->
                             <span class="pic">
                                <img src="../../images/st14.png" alt="" width="70%">
                            </span>
		                    <div class="mui-media-body">留言反馈</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><router-link to="#">
		                    <!-- <span class="mui-icon mui-icon-search"></span> -->
                             <span class="pic">
                                <img src="../../images/st12.png" alt="" width="70%">
                            </span>
		                    <div class="mui-media-body">视频专区</div></router-link></li>
		            <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3"><router-link to="#">
		                    <!-- <span class="mui-icon mui-icon-phone"></span> -->
                             <span class="pic">
                                <img src="../../images/18.png" alt="" width="70%">
                            </span>
		                    <div class="mui-media-body">联系我们</div></router-link></li>
		         
		        </ul> 
		</div>

       
    </div>
</template>
<script>
 import {Toast} from 'mint-ui'
 //导入轮播组件
 import Lunbo from '../comments/lunbo/lunbo.vue'    
export default {
  data() {
    return {
        getlunbotu:[//后台传过来的数据放到这里 好渲染到页面上
            {img:'../../images/8.jpg'},
            {img:'../../images/55st.png'},
            {img:'../../images/106st.png'}
        ]
    };
  },
  created(){
      this.getLunbotu()
  },
  methods: {
     
    //调轮播图的数据
    getLunbotu() {
      this.$http.get("url").then(
          function(res){
              console.log(res)
              if(res.status === 0){
                  this.getlunbotu = res.body.message
              }else{
                  Toast({  
                  message: '加载轮播图失败', //提示内容分
                  position: 'bottom', //提示框位置
                  duration: 5000 , //持续时间（毫秒），若为 -1 则不会自动关闭
                  iconClass: 'icon icon-success' , //icon 图标的类名
                  className:'addClass'   //Toast 的类名。可以为其添加样式
                })    
              }
          },
          function(err){
              console.log(err)
          }
      );
    }
  },
  components:{
      Lunbo
  }
};
</script>
<style scoped>
.mint-swipe {
  /* margin-top: 40px; */
  height: 150px;
}
.mint-swipe-item img{
    width: 100%;
    height: 100%;
}
.mui-media-body{
    font-size: 13px !important;
}
</style>